import 'package:flutter/material.dart';

/// 使用 SliverAnimatedList 的简单示例组件
class Test_SliverAnimatedList extends StatelessWidget {
  Test_SliverAnimatedList({super.key});

  // SliverAnimatedList 的唯一 key，用于操作列表（插入、删除等）
  final GlobalKey<SliverAnimatedListState> _listKey = GlobalKey();

  // 用于存储当前的 item 数据
  final List<int> _items = [];

  // 计数器，用于给每个 item 生成唯一数字
  int _counter = 0;

  /// 添加一个新 item 到列表顶部
  void _addItem() {
    _items.insert(0, _counter++); // 在列表开头插入一个新数字
    _listKey.currentState?.insertItem(0); // 通知 SliverAnimatedList 插入动画
  }

  /// 删除顶部的 item
  void _removeItem() {
    if (_items.isEmpty) return; // 如果列表为空，不执行删除
    int removedItem = _items.removeAt(0); // 移除并记录被删除的元素
    _listKey.currentState?.removeItem(
      0,
      // 构建删除动画效果
          (context, animation) => FadeTransition(
        opacity: animation,
        child: ListTile(title: Text('Item $removedItem')),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('SliverAnimatedList 简化示例')),

      // 主体部分：CustomScrollView + SliverAnimatedList
      body: CustomScrollView(
        slivers: [
          // 可支持动画插入/删除的 Sliver 列表
          SliverAnimatedList(
            key: _listKey, // 关键 key，用于后续操作
            initialItemCount: _items.length, // 初始条目数量
            itemBuilder: (context, index, animation) {
              // 每个 item 的动画显示方式：渐隐
              return FadeTransition(
                opacity: animation,
                child: ListTile(title: Text('Item ${_items[index]}')),
              );
            },
          ),
        ],
      ),

      // 右下角两个按钮：添加 和 删除
      floatingActionButton: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          FloatingActionButton(
            onPressed: _addItem, // 添加 item
            child: Icon(Icons.add),
          ),
          SizedBox(height: 10), // 间距
          FloatingActionButton(
            onPressed: _removeItem, // 删除 item
            child: Icon(Icons.remove),
          ),
        ],
      ),
    );
  }
}
